import React from 'react';
import { Link } from 'react-router-dom';
import {
  FormOutlined,
  DeleteOutlined,
  AuditOutlined,
} from '@ant-design/icons';
import moment from 'moment';

const getColumns = (props: any) => {
  const columns = [
    {
      title: 'No',
      dataIndex: 'no',
      key: 'id',
      width: '20%',
      render: (_text: string, _row: any, index: number) => index + 1,
    },
    {
      title: 'Role',
      dataIndex: 'name',
      key: 'name',
      width: '30%',
    },
    {
      title: 'Registration time',
      dataIndex: 'createTime',
      key: 'createTime',
      width: '30%',
      render: (text: any) => (text ? moment(text).format('YYYY-MM-DD HH:mm:ss') : ''),
    },
    {
      title: 'Actions',
      key: 'action',
      width: '20%',
      render: (_text: any, row: any) => (
        <span>
          <Link to={`/permission/edit?id=${row.id as string}`}
            className="cursor-pointer text-gray-500 mr-4"
          >
            <FormOutlined />
          </Link>

          {/* 1待审核 2审核通过 3驳回 */}
          {
            (() => (
              row.status === 1 ? <span
                className="cursor-pointer text-gray-500 mr-4"
                onClick={() => props.showAuditModal(row.id as string)}
              >
                <AuditOutlined/>
              </span> : <></>
            ))()
          }

          <span
            className="cursor-pointer text-gray-500"
            onClick={() => props.deleteItem(row.id)}
          >
            <DeleteOutlined />
          </span>
        </span>
      ),
    },
  ];

  return columns;
};

export { getColumns };
